import { mapMutations, mapActions, mapState } from "vuex";
import _ from "lodash";
import { typeClassName } from "@/pages/config/classNameMap";
import dayjs from "dayjs";
import { options } from "less";
export default {
  data() {
    return {
      vms: {}, //页面组件vue实例
      models: {
        //模型
        material: {
          ...typeClassName["material"],
        },
        reductionWorkCenter: {
          ...typeClassName["reductionWorkCenter"],
        },
        reductionRouting: {
          ...typeClassName["reductionRouting"],
        },
      },
      onlyRead: false,
      selfFilter: {},
      workCenterOptions: [],
      routetingOptions: [],
      dataSet: {
        //数据集
        tableData: [],
        formData: {},
      },
    };
  },
  provide() {
    return {
      anc: this,
    };
  },
  computed: {
    attrs() {
      return {
        labelWidth: 100,
        labelPosition: "right",
        cols: 2,
        columns: [
          {
            key: "sf_code",
            title: "参数编码",
            minWidth: 100,
            align: "center",
            config: { type: "text", disabled: this.onlyRead },
          },
          {
            key: "sf_name",
            title: "参数名称",
            minWidth: 100,
            align: "center",
            config: { type: "text", disabled: this.onlyRead },
          },
          {
            key: "sf_category",
            title: "参数分类",
            minWidth: 100,
            align: "center",
            config: {
              type: "select",
              options: [
                { value: "粒度", label: "粒度" },
                { value: "筛分", label: "筛分" },
                { value: "氧指数", label: "氧指数" },
                { value: "煅损", label: "煅损" },
                { value: "化学成分", label: "化学成分" },
                { value: "松装密度", label: "松装密度" },
                { value: "外观", label: "外观" },
                { value: "WO₃纯度", label: "WO₃纯度" },
                { value: "振实密度", label: "振实密度" },
                { value: "粒度分布", label: "粒度分布" },
                { value: "孔隙度", label: "孔隙度" },
                { value: "总碳", label: "总碳" },
                { value: "游离碳", label: "游离碳" },
                { value: "流动性", label: "流动性" },
                { value: "扫描电镜", label: "扫描电镜" },
              ],
              disabled: this.onlyRead,
            },
          },
          {
            key: "routing",
            title: "工艺路径",
            minWidth: 100,
            align: "center",
            config: {
              type: "select",
              options: this.routetingOptions,
              disabled: this.onlyRead,
            },
          },
          {
            key: "workCenter",
            title: "工作中心",
            minWidth: 100,
            align: "center",
            config: {
              type: "select",
              options: this.workCenterOptions,
              disabled: this.onlyRead,
            },
          },
          {
            key: "categoryCode",
            title: "分类编码",
            minWidth: 100,
            align: "center",
            config: { type: "text", disabled: this.onlyRead },
          },
          {
            key: "modelName",
            title: "规格",
            minWidth: 100,
            align: "center",
            config: { type: "text", disabled: this.onlyRead },
          },
          {
            key: "typeName",
            title: "型号",
            minWidth: 100,
            align: "center",
            config: { type: "text", disabled: this.onlyRead },
          },
          {
            key: "unitName",
            title: "单位",
            minWidth: 100,
            align: "center",
            config: { type: "text", disabled: this.onlyRead },
          },
        ],
        rules: {
          sf_name: [
            { required: true, message: "请输入参数名称", trigger: "blur" },
          ],
          sf_code: [
            { required: true, message: "请输入参数编码", trigger: "blur" },
          ],
          modelName: [
            { required: true, message: "请输入规格", trigger: "blur" },
          ],
        },

        // onlyRead: this.onlyRead,
      };
    },
  },
  created() {
    Object.keys(this.models).map((k) => {
      this.models[k].clz = this.$modelObject.create(this.models[k].modelType);
      this.models[k].clzs = this.$modelObject.create(
        this.models[k].modelType + "Collection"
      );
    });
  },
  mounted() {
    this.getRouting();
    this.getWorkCenter();
    this.$nextTick(() => {
      if (process.env.NODE_ENV === "development") {
        console.log(this);
      }
    });
  },
  methods: {
    /**
     *
     * @param {分页} pageNavigation
     * @param {筛选条件} filter
     * @param {*} orderBy
     * 页面加载方法
     */
    loadPage(pageNavigation, filter) {
      let newFilter = {
        ...filter,
        className: this.models.material.className,
        type: this.models.material.type,
        ...this.selfFilter,
      };
      this.vms.mainTable.loading = true;
      this._$queryByPage(
        this.models["material"].clzs,
        pageNavigation,
        newFilter,
        "",
        "",
        false
      ).then((res) => {
        this.vms.mainTable.loading = false;
        // 整理数据 数据格式
        this.dataSet.tableData = this.models["material"].clzs.valueRecords;
        // this.vms.mainTable.pageNavigation.total =
        //   this.models["material"].clzs.total;
      });
    },

    // 获取工艺路径
    getRouting() {
      let data = {
        type: "routing",
      };
      this.$api.RoutingConfiguration.query(data)
        .then((res) => {
          console.log(res);
          // this.dataSet.routing = res.data.data.records;
          this.getOptions(res, "routetingOptions");
        })
        .catch((err) => {
          console.log(err);
        });
    },

    getWorkCenter() {
      let data = {
        type: "workCenter",
      };
      this.$api.WorkCenterConfiguration.query(data)
        .then((res) => {
          console.log(res);
          // this.dataSet.routing = res.data.data.records;
          this.getOptions(res, "workCenterOptions");
        })
        .catch((err) => {
          console.log(err);
        });
    },
    getOptions(records, optionsName) {
      this[optionsName] = records.map((ele) => {
        return {
          value: ele.className,
          label: ele.comments,
        };
      });
    },
    /**
     * 巡检项新增
     */
    handleCreate() {
      this.vms.createModal.show = true;
      this.onlyRead = false;
      this.dataSet.formData = this.$modelObject.getTpl(
        this.models.material.modelType
      ); // 这是一个整理接口数据JSON格式的方法
      this.dataSet.formData.values["sf_status"] = "启用";
    },
    /**
     *
     * @param {*} row
     * 巡检项查看
     */
    handleDetail(row) {
      console.log(row);
      this.vms.detailModal.show = true;
      this.dataSet.formData = row;
      this.dataSet.configFormData = row.web;
      this.onlyRead = true;
    },
    /**
     *
     * @param {*} row
     * 巡检项编辑
     */
    handleEdit(row) {
      this.vms.editModal.show = true;
      this.onlyRead = false;
      this.dataSet.formData = row;
      this.dataSet.configFormData = row.web;
    },
    /**
     *
     * @param {行数据} row
     * @param {索引} index
     * 巡检项删除数据
     */
    handleDelete(row, index) {
      let _this = this;
      this._$deleteConfirm(() => {
        _this
          ._$deleteByIds(_this.models.material.clzs, [String(row.id)])
          .then((res) => {
            _this.models["material"].clzs.records.splice(index, 1);
            _this.dataSet.tableData =
              _this.models["material"].clzs.setValueRecords();
            _this.vms.mainTable.pageNavigation.total--;
          });
      });
    },
    /**
     *
     * @param {行数据} selection
     */
    handleDeleteMultiple(selection) {
      let _this = this;
      this._$deleteConfirm(() => {
        let ids = selection.map((item) => String(item.id));
        _this._$deleteByIds(_this.models.material.clzs, ids).then((res) => {
          _this.vms.mainTable.pageNavigation.pageNumber = 1;
          _this.loadPage(_this.vms.mainTable.pageNavigation, {}, "", "", false);
        });
      });
    },

    // 创建巡检项提交
    createModalOk() {
      // this.vms.createView.validate((valid) => {
      this._$validateAll([this.vms.createView], (valid) => {
        if (valid) {
          this._merge(this.dataSet.formData, {
            className: this.models.material.className,
            type: this.models.material.type,
            name: dayjs().valueOf(),
          });
          this._$add(this.models["material"].clz, this.dataSet.formData).then(
            (flag) => {
              if (flag) {
                this.vms.createView.loading = false;
                this.vms.createModal.show = false;
                this.vms.createView.resetFields();
                this.vms.mainTable.loadPage(
                  this.vms.mainTable.pageNavigation,
                  {},
                  "",
                  "",
                  false
                );
              }
            }
          );
        } else {
          this.$Message.info("请填写必填内容");
        }
      });
    },

    editModalOk() {
      this.vms.editView.validate((valid) => {
        if (valid) {
          this.models.material.clz.setRecord(this.dataSet.formData);
          this.models.material.clz.updateById().then((flag) => {
            if (flag) {
              this.vms.editView.loading = false;
              this.vms.editModal.show = false;
              // this.dataSet.configFormData = {};
              this.vms.mainTable.loadPage(
                this.vms.mainTable.pageNavigation,
                {},
                "",
                "",
                false
              );
            } else {
              this.vms.editView.loading = false;
            }
          });
        } else {
          // this.$Message.info("请填写必填内容");
          this._$requireInfo();
        }
      });
    },
  },
};
